/*
 * @Author: 徐建辰
 * @Date: 2021-11-04 16:46:39
 * @LastEditTime: 2021-11-04 17:11:23
 * @LastEditors: Please set LastEditors
 * @Description: 日历-天组件
 */
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames'
import {formatTime} from '@/utils/format'
import './datepicker.css'

function Day(props) {
  const {day, onSelect} = props
  if (!day) return <td className="null"></td>
  const classes = []
  const now = formatTime()
  // 判断day是否是过去
  if (day < now) classes.push('disabled')
  // 判断是否周六、周日
  if ([6, 7].includes(new Date(day).getDay())) classes.push('weekend')
  // 判断是否是今天
  const dateStr = now === day ? '今天' : new Date(day).getDate()

  return (
    <td className={classNames(classes)} onClick={() => onSelect(day)}>{dateStr}</td>
  )
}

Day.propTypes = {
  day: PropTypes.number,
  onSelect: PropTypes.func.isRequired
}

export default Day